import React from 'react';
import CategoryItem from './CategoryItem';

const CategoryList = ({ category }) => {
  return (
    <div className="category">
      <h2>{category.categoryName}</h2>
      <img src={category.imageUrl} alt={category.categoryName} className="category-image" />
      {category.twoCategoryList && category.twoCategoryList.length > 0 && (
        <div className="subcategory-container">
          {category.twoCategoryList.map((subCategory, index) => (
            <CategoryItem key={index} subCategory={subCategory} />
          ))}
        </div>
      )}
    </div>
  );
};

export default CategoryList;
